import Card from "antd/es/card/Card";
import { Button, Checkbox, Form, Input, Select, Space, Spin, InputNumber, Table, DatePicker,Radio } from 'antd';
import React, { useEffect, useRef, useState } from 'react';
import _ from 'lodash';
import { useParams, useHistory } from 'react-router-dom';
import FetchHelper from "../../../../../utils/helper/fetch-helper";


export default function JcdEdit(props) {
  const dynamicForms = [
    {
      "alias": "用户账号",
      "name": "userName",
      "type": "input"
    },
    {
      "alias": "用户密码",
      "name": "password",
      "type": "input"
    },
    {
      "alias": "用户昵称",
      "name": "nickName",
      "type": "input"
    },
    {
      "alias": "民族",
      "name": "nation",
      "type": "input"
    },
    // {
    //     "alias": "身份证",
    //     "name": "idCard",
    //     "type": "input"
    // },
    {
      "alias": "身份证号",
      "name": "IdCard",
      "type": "input"
    },
    {
      "alias": "用户性别",
      "name": "sex",
      "type": "rddio"
    },
    {
      "alias": "行政区划编码",
      "name": "areaCode",
      "type": "select"
    },
    {
      "alias": "用户邮箱",
      "name": "email",
      "type": "input"
    }
  ]
  const [idDatas, setIdDatas] = useState();
  const [id, setId] = useState();
  const [form] = Form.useForm();
  const [xqDatas, setXqDatas] = useState();
  const [xqJson, setXqJson] = useState({})

  const [params, setParams] = useState({
    pageSize: 10,
    pageNum: 1,
    jcdlx: '河道'
  })
  useEffect(() => {
    FetchHelper.getJson(`/admin-api/getInfo`).then(resp => {
      setId(resp.data.user.userId)
    })


  }, [])

  //
  useEffect(() => {
    if (id) {
      FetchHelper.getJson(`/admin-api/system/user/list?userId=${id}`).then(resp => {
        console.log(resp)
        setIdDatas(resp.rows)
        form.setFieldsValue(
          ...resp.rows,
        )
      })

    }



  }, [id, form])

  const history = useHistory();
  const quxiaoHandle = () => {
    history.push(`/main/home`)
  }

  const onFinish = (values) => {
   
    if (id) {
      values.userId=id
     
      FetchHelper.putJson(`/admin-api/system/user`, values).then(resp => {
        alert("修改成功")
      }).catch(err => {
        alert("修改失败")
      })
    }




  }
  return <div className='layout-h h100' style={{
    overflow: "scroll"
  }}>
    <Card className='h100 fill' style={{
      height: "1500px"
    }}>
      <Form method="post"
        onFinish={onFinish}
        form={form}>
        <header style={{
          fontSize: 20,
          fontWeight: "bold"
        }}>个人信息</header>
        <hr />

        <div className="InputForm" style={{
          display: "flex",
          flexWrap: "wrap"
        }}>
          {dynamicForms.map((formItem) => {
            let node;
            switch (formItem.type) {
              case 'select':
                node = <Select>
                  <Select.Option value="511502">翠屏区</Select.Option>
                  <Select.Option value="511503">南溪区</Select.Option>
                  <Select.Option value="511504">叙州区</Select.Option>
                  <Select.Option value="511523">江安县</Select.Option>
                  <Select.Option value="511524">长宁县</Select.Option>
                  <Select.Option value="511525">高县</Select.Option>
                  <Select.Option value="511526">珙县</Select.Option>
                  <Select.Option value="511527">筠连县</Select.Option>
                  <Select.Option value="511528">兴文县</Select.Option>
                  <Select.Option value="511529">屏山县</Select.Option>
                </Select>;
                break;
                case 'rddio':
                  node = <Radio.Group>
                  <Radio value="0"> 男 </Radio>
                  <Radio value="1"> 女 </Radio>
                </Radio.Group>;
                  break;
              case 'input':
              default:
                node = <Input style={{
                  width: "90%"
                }}
                  onChange={(e) => {

                  }}

                />
            }
            return <div style={{
              flexBasis: "33%",
              marginBottom: "10px"
            }}><Form.Item
              label={formItem.alias}
              name={formItem.name}

              rules={[
                {
                  // required: true,

                }
              ]}

            >
                {node}
              </Form.Item></div>

          })}

        </div>


        <div className="layout-h">
          <Button className="btn1" type="primary"
            htmlType="submit"
          //onClick={baocunHandle}
          >修改</Button>

          <Button onClick={quxiaoHandle} className="btn2">返回</Button>
        </div>
      </Form>
    </Card>
  </div>
}